{extend name="common/common" /}

{block name="style"}
<style type="text/css">
.layui-form-label{
	width: 90px;
}
.btn.btn-info{
	margin-top: 2px;
}
.configList{
	display: block;
	border: 2px solid #e7eaec;
	padding: 15px;
	height: 300px;
	overflow-y: scroll;
}
.badge{
	background-color: #ec4758;
	color: #FFF;
	padding:3px 4px;
	font-weight: 1;
	border-radius: 50%;
	cursor: pointer;
}
.showRemark{
	cursor: pointer;
}
.StaticTableBox{
	overflow-x: auto;
}
.table.table-bordered.table-hover.text-center{
	min-width: 800px;
}
#ID_Photo{
	width: 190px;
	height: 271px;
	background: blue;
	color:#FFF;
	line-height: 421px;
	cursor: pointer;
}
.layui-tab-card > .layui-tab-title{
	background-color: #2f4050;
    color: #FFF;
}
.ibox-title{
	background-color: #2f4050;
	color: #FFF;
}
#scoreTable .layui-input,#scoreListBox .layui-input{
	text-align: center;
	border: 0;
	outline: 0;
	background: none;
	height: 24px;
	line-height: 24px;
}
#chooseCurriculumBox{
	background-color:#f3f3f4;
	padding: 15px;
	margin-top:15px;
	margin-bottom: 15px;
}
.layui-form-checkbox{
	margin-bottom: 15px;
}
.layui-tab-content{
	overflow-x: auto;
}
#markShade{
	position: fixed;
	width: 100%;
	height: 100%;
	background-color: #000;
	z-index: 999999999;
	opacity: 0.3;
	display: none;
}
</style>
{/block}

{block name="content"}
<div id="markShade"></div>
<div class="wrapper wrapper-content animated fadeInRight col-lg-12">
	<!-- start of 学员信息详情 -->
    <div class="ibox float-e-margins col-lg-8">
		<div class="layui-tab layui-tab-card">
			<ul class="layui-tab-title">
				<li class="layui-this">学员基本信息</li>
				<li>学员成绩录入</li>
			</ul>
			<div class="layui-tab-content" style="background-color:#FFF">
				<div class="layui-tab-item layui-show">
					<div class="layui-form-item text-center">
						<label class="layui-form-label">一寸照片</label>
						<div class="layui-input-inline">
							{if authCheck('attachment/uploadidphoto')}
							<div id="ID_Photo" data-action="uploadIdPhoto" data-multiple="false" data-ext="png,jpg,jpeg" data-upload="stidphoto/stIdPhoto_{$stInfo.id}">
							{else}
							<div id="ID_Photo">
							{/if}
							</div>
						</div>
					</div>
					<form class="layui-form" action="" id="editForm">
						<div class="layui-form-item">
							<label class="layui-form-label">学员姓名</label>
							<div class="layui-input-inline">
								<input type="text" name="name" value="{$stInfo.name|default=''}" class="layui-input">
							</div>
							<label class="layui-form-label">联系电话</label>
							<div class="layui-input-inline">
								<input value="{$stInfo.phone|default=''}" type="text" name="phone" class="layui-input">
							</div>
						</div>

						<div class="layui-form-item">
							<label class="layui-form-label">学　　校</label>
							<div class="layui-input-inline">
								<input value="{$stInfo.school|default=''}" type="text" name="school" readonly class="layui-input selectSchool school layui-disabled" disabled>
								<input value="{$stInfo.school_id|default=''}" type="hidden" name="school_id" class="school_id" disabled>
							</div>

							<label class="layui-form-label">选择专业</label>
							<div class="layui-input-inline">
								<input value="{$stInfo.major|default=''}" type="text" name="major" readonly class="layui-input selectSchool major layui-disabled" disabled>
								<input value="{$stInfo.major_id|default=''}" type="hidden" name="major_id" class="major_id" disabled>
							</div>
						</div>

						<div class="layui-form-item">
							<label class="layui-form-label">批　　次</label>
							<div class="layui-input-inline">
								<input type="text" name="batch" value="{$stInfo.batch|default=''}" class="layui-input layui-disabled" readonly>
							</div>

							<!-- <label class="layui-form-label">班　　级</label>
							<div class="layui-input-inline">
								<input type="text" name="class" value="{$stInfo.class|default=''}" class="layui-input layui-disabled" readonly>
							</div> -->

						</div>

						<div class="layui-form-item">
							<label class="layui-form-label">民　　族</label>
							<div class="layui-input-inline">
								<input value="{$stInfo.nation|default=''}" type="text" name="nation" class="layui-input">
							</div>

							<label class="layui-form-label">身份证号</label>
							<div class="layui-input-inline">
								<input value="{$stInfo.id_card|default=''}" type="text" name="id_card" class="layui-input">
							</div>
						</div>

						<div class="layui-form-item">
							<label class="layui-form-label">生　　日</label>
							<div class="layui-input-inline">
								<input value="{$stInfo.birthday|default=''}" type="text" name="birthday" readonly class="layui-input birthday">
							</div>
							<label class="layui-form-label">性　　别</label>
							<div class="layui-input-inline">
								<select name="sex" class="layui-input">
									{if $stInfo.sex eq 0}<option value="0" selected>保密</option>
									{else}<option value="0">保密</option>
									{/if}
									{if $stInfo.sex eq 1}<option value="1" selected>男</option>
									{else}<option value="1">男</option>
									{/if}
									{if $stInfo.sex eq 2}<option value="2" selected>女</option>
									{else}<option value="2">女</option>
									{/if}
								</select>
							</div>
						</div>

						<div class="layui-form-item">
							<label class="layui-form-label">考试时间</label>
							<div class="layui-input-inline">
								<input value="{$stInfo.test_time|default=''}" type="text" name="test_time" readonly class="layui-input test_time">
							</div>
							<label class="layui-form-label">学籍状态</label>
							<div class="layui-input-inline">
								<select name="school_roll" class="layui-input" disabled>
									{if $stInfo.school_roll eq 0}<option value="0" selected>报名</option>
									{else}<option value="0">报名</option>
									{/if}
									{if $stInfo.school_roll eq 1}<option value="1" selected>在读</option>
									{else}<option value="1">在读</option>
									{/if}
									{if $stInfo.school_roll eq 2}<option value="2" selected>毕业</option>
									{else}<option value="2">毕业</option>
									{/if}
									{if $stInfo.school_roll eq 3}<option value="3" selected>休学</option>
									{else}<option value="3">休学</option>
									{/if}
									{if $stInfo.school_roll eq 4}<option value="4" selected>退学</option>
									{else}<option value="4">退学</option>
									{/if}
								</select>
							</div>
						</div>

						<div class="layui-form-item text-center">
				        	<input type="hidden" value="{$stInfo.id|default=''}" name="id">
				        	{if authCheck('education/editstinfo')}
				            <button class="btn btn-primary" type="submit">保存</button>
				            {/if}
						</div>

					</form>
				</div>
				<div class="layui-tab-item">
					<form class="layui-form" action="" method="post" id="scoreForm">
						<div class="layui-form-item">
							<label class="layui-form-label">学员姓名</label>
							<div class="layui-input-inline">
								<input type="text" name="st_name" readonly value="{$stInfo.name|default=''}" class="layui-input layui-disabled">
								<input type="hidden" name="st_id" value="{$stInfo.id|default=''}">
							</div>
							<label class="layui-form-label label-required">第几学期</label>
							<div class="layui-input-inline">
								<select id="selectTerm" name="term" required>
									<option value="0">请选择</option>
									<option value="1">第1学期</option>
									<option value="2">第2学期</option>
									<option value="3">第3学期</option>
									<option value="4">第4学期</option>
									<option value="5">第5学期</option>
									<option value="6">第6学期</option>
									<option value="7">第7学期</option>
									<option value="8">第8学期</option>
									<option value="9">第9学期</option>
									<option value="10">第10学期</option>
								</select>
							</div>
						</div>
						<div id="chooseCurriculumBox">
							{if condition="empty($Curriculum)"}
							<p>该专业下暂时没有课程</p>
							{else}
							{volist name="Curriculum" id="c"}
								<input type="checkbox" value="{$c.id}" lay-filter="Curriculum" title="{$c.name}">
							{/volist}
							{/if}
						</div>
						<div id="scoreTableBox">
							<table class='table table-bordered table-hover text-center' id="scoreTable">
								<thead>
									<tr>
										<th class="text-center">课程名称</th>
										<th class="text-center">平时成绩</th>
										<th class="text-center">考试成绩</th>
										<th class="text-center">综合成绩</th>
									</tr>
								</thead>
								<tbody>
								</tbody>
							</table>
						</div>
						<p class="text-right">
							<button type="button" class="btn btn-primary" id="saveScore">确认提交</button>
						</p>
					</form>
				</div>
			</div>
		</div>
	</div>
	<!-- end of 学员信息详情 -->

	<div id="scoreListBox" class="ibox float-e-margins col-lg-8">
		<div class="layui-tab layui-tab-card">
			<ul class="layui-tab-title">
				{volist name="scoreList" id="s" key="i"}
				{if $i eq 1}
				<li class="layui-this" style="width:10%;">第{$i}学期</li>
				{else}
				<li style="width:10%;">第{$i}学期</li>
				{/if}
				{/volist}
			</ul>
			<div class="layui-tab-content" style="background:#FFF">
				{volist name="scoreList" id="content" key="j"}
				{if $j eq 1}
				<div class="layui-tab-item layui-show">
				{else}
				<div class="layui-tab-item">
				{/if}
					<table class="table table-bordered table-hover text-center">
						<thead>
							<tr>
								<th class="text-center">课程名称</th>
								<th class="text-center">平时成绩</th>
								<th class="text-center">考试成绩</th>
								<th class="text-center">综合成绩</th>
							</tr>
						</thead>
						<tbody>
							{volist name="content" id="row"}
							<input type="hidden" name="id" value="{$row.id}">
							<tr>
								<td data-rowId="{$row.id}">{$row.curriculum_name}</td>
								<td>
									<input class="layui-input saveChange manualInput-{$row.id}" data-class="manualInput-{$row.id}" data-rowId="{$row.id}" type="text" name="scoreNormal" value="{$row.scoreNormal}">
								</td>
								<td>
									<input class="layui-input saveChange manualInput-{$row.id}" data-class="manualInput-{$row.id}" data-rowId="{$row.id}" type="text" name="scoreExam" value="{$row.scoreExam}">
								</td>
								<td>
									<input class="layui-input autoInput-{$row.id}" data-class="autoInput-{$row.id}" data-rowId="{$row.id}" type="text" name="scoreFinal" value="{$row.scoreFinal}" readonly>
								</td>
							</tr>
							{/volist}
						</tbody>
					</table>
				</div>
				{/volist}
			</div>
		</div>
	</div>

	<div class="ibox float-e-margins">
		<div class="ibox-title">
            <h5>学籍变动信息</h5>
        </div>
		<div class="ibox-content">
			<div class="StaticTableBox">
			<table class="table table-bordered table-hover text-center">
				<thead>
					<tr>
						<th class="text-center">ID</th>
						<th class="text-center">变动原因</th>
						<th class="text-center">是否异常</th>
						<th class="text-center">由(学校-专业-批次-班级)</th>
						<th class="text-center">转至(学校-专业-批次-班级)</th>
						<th class="text-center">变动时间</th>
						<th class="text-center">备注</th>
					</tr>
				</thead>
				<tbody>
					{volist name="$rollInfo" id="v"}
					<tr>
						<td>{$v.id}</td>
						<td>
							{$v.roll_name|default=""}
						</td>
						<td>
							{if $v.abnormal eq 0}正常
							{else}<span class="span-danger span-strong">异常</span>
							{/if}
						</td>
						<td>{$v.school}-{$v.major}-{$v.batch}-{$v.class}</td>
						<td>{$v.to_school}-{$v.to_major}-{$v.to_batch}-{$v.to_class}</td>
						<td>{$v.create_time|date="Y-m-d",###}</td>
						<td>
							{if condition="mb_strlen($v.remark) > 20"}
								<span class="span-info showRemark" data-param="{$v.remark}">{:mb_substr($v.remark,0,20).'...'}</span>
							{else}
								{$v.remark}
							{/if}
						</td>
					</tr>
					{/volist}
				</tbody>
			</table>
			</div>
		</div>
	</div>
	<!-- end of 学籍变动信息 -->
	<div class="ibox float-e-margins">
		<div class="ibox-title">
            <h5>学员财务信息</h5>
        </div>
		<div class="ibox-content">
			<div class="StaticTableBox">
			<table class="table table-bordered table-hover text-center">
				<thead>
					<tr>
						<th class="text-center">ID</th>
						<th class="text-center">订单单号</th>
						<th class="text-center">流水单号</th>
						<th class="text-center">来源</th>
						<th class="text-center">学费</th>
						<th class="text-center">报名费</th>
						<th class="text-center">资料费</th>
						<th class="text-center">照片采集费</th>
						<th class="text-center">金额总计</th>
						<th class="text-center">到期时间</th>
						<th class="text-center">状态</th>
						<th class="text-center">备注</th>
					</tr>
				</thead>
				<tbody>
					{volist name="$FinanceInfo" id="v"}
					<tr>
						<td>{$v.id}</td>
						<td>{$v.order_sn}</td>
						<td>{$v.account_sn}</td>
						<td>
							{if $v.source eq 0}学费
							{elseif $v.source eq 1}报销
							{elseif $v.source eq 2}罚款
							{elseif $v.source eq 3}退款
							{else}其他
							{/if}
						</td>
						<td>{$v.tuition|default=0}</td>
						<td>{$v.registration|default=0}</td>
						<td>{$v.material_cost|default=0}</td>
						<td>{$v.photo_collection|default=0}</td>
						<td>{$v.total}</td>
						<td>
							{$v.finish_time|date="Y-",###}
							{if condition=" date('Ym',$v.finish_time) == date('Ym',time()) "}
								<span class="span-danger span-strong">{$v.finish_time|date="m",###}</span>
							{else}
								{$v.finish_time|date="m",###}
							{/if}
							{$v.finish_time|date="-d",###}
						</td>
						<td>
							{if $v.status eq 0}未支付
							{elseif $v.status eq 1}<span class="span-primary">已支付</span>
							{elseif $v.status eq 2}<span class="span-warning">已逾期</span>
							{elseif $v.status eq 3}已拒绝
							{elseif $v.status eq 4}已同意
							{elseif $v.status eq 5}<span class="span-gray"></span>已取消
							{else}其他
							{/if}
						</td>
						<td>
							{if condition="mb_strlen($v.remarks) > 20"}
								<span class="span-info showRemark" data-param="{$v.remarks}">{:mb_substr($v.remarks,0,20).'...'}</span>
							{else}
								{$v.remarks}
							{/if}
						</td>
					</tr>
					{/volist}
				</tbody>
			</table>
			</div>
		</div>
	</div>
	<!-- end of 学员财务信息 -->
</div>

<div class="laycontent" style="display: none;width: 300px;padding: 30px 15px;">
    <ul id="tree"></ul>
</div>

<div class="layclassify" style="display: none;width: 300px;padding: 30px 15px;">
    <ul id="classifytree"></ul>
</div>

<div class="layRemark" style="display: none;text-indent: 2rem;padding: 15px;">
</div>
{/block}

{block name="script"}
<script>
$(function(){
	layui.use('element', function(){
	  	var element = layui.element;
	})
	getTree();
	layui.use(['form','laydate'], function(){
  		var form = layui.form,laydate = layui.laydate;
		laydate.render({
		    elem: '.test_time',
			type: 'datetime'
		});
		laydate.render({
		    elem: '.birthday',
			type: 'date'
		});

		form.on('checkbox(Curriculum)', function(data){
			// console.log(data.elem); //得到checkbox原始DOM对象
			// console.log(data.elem.checked); //是否被选中，true或者false
			// console.log(data.value); //复选框value值，也可以通过data.elem.value得到
			// console.log(data.othis); //得到美化后的DOM对象
			if(data.elem.checked){
				// 选中添加
				var tr = "<tr class='tr-index-" + data.value + "' data-index='" + data.value + "'><td>";
				tr += data.elem.title + "</td>";
				// 课程ID为data.value的平时成绩
				tr += "<td><input type='text' placeholder='0.00' name='scoreNormal_" + data.value;
				tr += "' class='layui-input manual-input' data-index='" + data.value + "'></td>";
				// 课程ID为data.value的考试成绩
				tr += "<td><input type='text' placeholder='0.00' name='scoreExam_" + data.value;
				tr += "' class='layui-input manual-input' data-index='" + data.value + "'></td>";
				// 课程ID为data.value的综合成绩
				tr += "<td><input type='text' placeholder='0.00' name='scoreFinal_" + data.value;
				tr += "' class='layui-input auto-input-" + data.value + "' readonly></td>";
				$("#scoreTable tbody").append(tr);
			}else{
				// 取消删除
				var elArr = $("#scoreTable tbody tr");
				for(var i=0;i<elArr.length;i++){
					var this_index = elArr[i].getAttribute('data-index');
					var className = '.tr-index-' + this_index;
					if(data.value == this_index){
						$("#scoreTable tbody").children(className).remove();
					}
				}
			}
			$(".manual-input").on("keyup",function(){
				var this_index = $(this).attr('data-index');
				var className = ".auto-input-" + this_index;
				var trClassName = ".tr-index-" + this_index;
				var manualInputsClassName = trClassName + " .manual-input";
				var is_complete = false;
				var manualInputs = $(manualInputsClassName);
				if(manualInputs[0].value != '' && manualInputs[1].value != ''){
					is_complete = true;
				}
				if(is_complete){
					var source = Math.floor((manualInputs[0].value*0.3 + manualInputs[1].value*0.7)*100)/100;
					$(className).val(source);
				}
			});
		});
  	});

	$('.selectSchool').on('click',function(){
		selectSchoolBox = layer.open({
            type: 1,
            title: '请选择学校和专业',
            anim: 2,
            skin: 'layui-layer-molv', //加上边框
            area: ['300px', '450px'], //宽高
            content: $(".laycontent")
        });
	});

	$('#editForm').on('submit',function(){
		var params = $('#editForm').serialize();
		$.post('editSTInfo',params,function(res){
			if(res.code == 1){
				layer.alert(res.msg, {title: '友情提示', icon: 1, closeBtn: 0}, function(){
                    layer.closeAll();
					window.history.back();
                });
			}else{
				layer.msg(res.msg, {anim: 6});
			}
		});
		return false;
	});

	$(".showRemark").on('dblclick',function(){
		var remark = $(this).attr('data-param');
		$('.layRemark').html(remark);
		remarkBox = layer.open({
			type: 1,
            title: '备注信息',
            anim: 2,
            skin: 'layui-layer-molv', //加上边框
            area: ['300px', '450px'], //宽高
            content: $('.layRemark')
		});
	});

	if("{$stInfo.id_photo_url}" != ""){
		$("#ID_Photo").css({"background":"url({$stInfo.id_photo_url}) no-repeat","background-size":"190px 271px"});
	}

	// 保存学生成绩
	$("#saveScore").on('click',function(){
		if($("#selectTerm").val() == 0){
			layer.msg("请选择第几学期",{anim:6});
			return false;
		}
		var param = $("#scoreForm").serialize();
		$.post('./saveScore',param,function(res){
			if(res.code == 0){
				layer.msg(res.msg,{anim:6});
			}else{
				layer.msg(res.msg,{anim:1},function(){
					window.location.reload();
				});
			}
		})
	});

	$(".saveChange").on('change',function(){
		$("#markShade").show();
		var manualInputsClassName = "."+$(this).attr("data-class");
		var className = ".autoInput-" + $(this).attr("data-rowId");
		var is_complete = false;
		var manualInputs = $(manualInputsClassName);
		if(manualInputs[0].value != '' && manualInputs[1].value != ''){
			is_complete = true;
		}
		if(is_complete){
			var source = Math.floor((manualInputs[0].value*0.3 + manualInputs[1].value*0.7)*100)/100;
			$(className).val(source);
		}
		var row_id = $(this).attr("data-rowId")
		setTimeout(function(){
			var param = {
				'id':row_id,
				'scoreNormal':manualInputs[0].value,
				'scoreExam':manualInputs[1].value,
				'scoreFinal':source
			};
			$.post("./saveScoreChange",param,function(res){
				if(res.code == 0){
					layer.msg(res.msg,{anim:6},function(){
						window.location.reload();
					});
				}else{
					$("#markShade").hide();
					layer.msg(res.msg,{anim:1});
				}
			});
		},300);
	})
});
function getTree(){
    layui.use(['tree', 'layer'], function(){
        var layer = layui.layer;

        $.getJSON("{:url('product/school')}", function(res){
            if(111 == res.code){
                window.location.reload();
            }
            layui.tree({
                elem: '#tree'
                ,nodes: res.data
                ,click: function(node){
                    nowNode = node;
                    if(node.pid != 0){
                    	$('.major').val(node.name);
                    	$('.major_id').val(node.id);
                    	for(var i=0;i<res.data.length;i++){
                    		if(node.pid == res.data[i].id){
                    			$('.school').val(res.data[i].name);
                    			$('.school_id').val(res.data[i].id);
                    		}
                    	}
                    	layer.close(selectSchoolBox);
                    }
                }
            });
        });

        $.getJSON("{:url('product/classify')}", function(res){
            layui.tree({
                elem: '#classifytree'
                ,nodes: res.data
                ,click: function(node){
                    nowNode = node;
                	$('.selectClassify').val(node.name);
                	$('.c_id').val(node.id);
                	layer.close(selectclassifyBox);
                }
            });
        });

        $.getJSON("{:url('product/attr')}",function(res){
        	var attrhtml = '';
			for(var i=0;i<res.data.length;i++){
				attrhtml += '<div class="layui-form-item">';
				attrhtml += '<label class="layui-form-label attrName">'+ res.data[i].name +'</label>';
				attrhtml += '<div class="layui-input-inline"><select class="attrVal"><option value="">请选择</option>';
				for(var j=0;j<res.data[i].children.length;j++){
					attrhtml +='<option value="'+ res.data[i].id + '-' + res.data[i].children[j].id +'">'+ res.data[i].children[j].name +'</option>';
				}
				attrhtml += '</select></div></div>';
				$('#attrbox').html(attrhtml);
				var form = layui.form;
				form.render();
			}
        })
    });
}
</script>
{/block}
